<template>
  <div class="header">
    <div class="header-inner">

      <div style="display: inline-block;width: 1000px;height: 80px;margin-left: 200px">
        <div style="display: inline-block;margin-top: 25px">
             <span class="maoyan">猫眼电影</span>
        </div>

        <div style="display: inline-block;margin:25px;font-size: 24px;">
          <a href="" style=" margin-left: 10px;font-size: 24px;color: #333333">南宁
            <span class="iconfont icon-jiantouarrow486"style="margin-left:1px "></span>
          </a>
          <!--南宁<span class="iconfont icon-jiantouarrow486"style="padding-left:5px "></span>-->
          <router-link to="/homepage">
            <a href="" style=" margin-left: 20px;font-size: 24px;color: #333333">首页</a>
          </router-link>

          <router-link to="/movies">
            <a href="" style=" margin-left: 20px;font-size: 24px;color: #333333">电影</a>
          </router-link>

          <router-link to="/cinema">
            <a href="" style=" margin-left: 20px;font-size: 24px;color: #333333">影院</a>
          </router-link>

          <a href="" style=" margin-left: 20px;font-size: 24px;color: #333333">演出</a>

          <router-link to="/list">
            <a href="" style=" margin-left: 20px;font-size: 24px;color: #333333">榜单</a>
          </router-link>

          <a href="" style=" margin-left: 20px;font-size: 24px;color: #333333">热点</a>

          <router-link to="/shoppingmall">
            <a href="" style=" margin-left: 20px;font-size: 24px;color: #333333">商场</a>
          </router-link>

        </div>

      </div>


      <div style="float: right;margin-top: 30px;margin-right: 200px">
        App下载<span class="ihpone-icon iconfont icon-jiantouarrow486"style="margin-top:5px"></span>
        <div style="display: inline-block">
          <input class="search">
          </input>
        </div>
        <router-link to="/login">
          <div style="display: inline-block;margin-left: 4px">
            <a href="" style="text-decoration: none;color: #222222;">登录</a>
          </div>
        </router-link>

      </div>

    </div>


  </div>
</template>

<script>
  export default {
    name: "Header",
  }

</script>

<style >
  .header{
    top: 0;
    z-index: 999;
    width: 100%;
    min-width: 1200px;
    background-color: #fff;
    border-bottom: 1px solid #d8d8d8;
  }

  .header-inner{
    width: 100%;
    height: 80px;
  }
  .nav{
    display: inline-block;
    background-color: #fff;
  }
  .navbar{
    padding: 10px;
    margin: 15px;
    list-style: none;
    border: none;
  }
  .maoyan{
   font-size: 36px ;color: chocolate;margin-left: 50px;margin-top: 25px;
  }

  a{
    text-decoration: none;

  }

  .ihpone-icon{

    float: left;
    display: inline-block;
    width: 15px;
    height: 24px;
   ;
    background-size: cover;
  }
  .search {
    display: inline-block;
    height: 25px;
    line-height: 1.2;
    width: 150px;
    border: 1px solid #ccc;
    font-size: 14px;
    border-radius: 20px;
    background-color: #faf8fa;
    overflow: hidden;
    color: #333;
  }



</style>
